---
title: Portfolio
layout: default
---

<!DOCTYPE html>
<html class="no-js">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Leey - Timeline</title>
	<link rel="stylesheet" type="text/css" href="css/timeline.css" />
	<script src="js/modernizr.custom.js"></script>
</head>

<body>
	<div class="container" style="margin:0;padding:0;width:100%;">
		<header>
			<img width="175" height="175" style="border-radius:50%;" src="/img/avatar-Leey-ny.jpg">
			<h1>Leey</h1>
		</header>
		<div class="main">
			<ul class="cbp_tmtimeline">
				<li>
					<div class="cbp_tmlabel">
						<h2 id="boxoffice">在线重制emoji表情-Emoji Builder</h2>
						<time>2016.06</time>
						<img src="images/play-emoji.png">
						<ul>
							<li>
								工具就摆在那，就看你的创意了！网站可以将Emoji表情的各项素材自由拼合创作，操作简单易上手，各个元素可调节位置、大小、旋转角度。
							</li>
							<li class="skill">
								<span><b>玩一玩</b></span>
								<span class="i-react"></span>
								<span class="link"><a target="_blank" href=" http://phlntn.com/emojibuilder/">Try it</a></span>
							</li>
						</ul>
					</div>
				</li>
				<li>
					<div class="cbp_tmlabel">
						<h2>智能图像压缩中文版-Goimg.io</h2>
						<time>2015.09</time>
						<img src="images/work-goimg.png">
						<ul>
							<li>
								国内站长的作品，中文界面，值得推荐！网站可以在线高质量压缩各种类型的图片，随时随地打开网站即可使用,通过监督学习训练压缩模型，来选择性地减少图像中的颜色数，在减少图片体积达到极限的同时，让肉眼几乎看不出与原图的差异！
							</li>
							<li class="skill">
								<span><b>实用</b></span>
								<span class="i-react"></span>
								<span class="link"><a target="_blank" href="https://goimg.io/">Try it</a></span>
							</li>
						</ul>
					</div>
				</li>
				<li>
					<div class="cbp_tmlabel">
						<h2>在线工具 —— OSCHINA.NET社区</h2>
						<time>2020.04</time>
						<img src="images/tool-list.jpg">
						<ul>
							<li>
								OSCHINA.NET在线工具,ostools为开发设计人员提供在线工具，提供jsbin在线 CSS、JS 调试，在线 Java API文档,在线 PHP API文档,在线 Node.js API文档,Less
								CSS编译器，MarkDown编译器等其他在线工具
							</li>
							<li class="skill">
								<span><b>实用</b></span>
								<span class="i-react"></span>
								<span class="link"><a target="_blank" href="https://tool.oschina.net">Try it</a></span>
							</li>
						</ul>
					</div>
				</li>

				<!-- <li>
						<div class="cbp_tmlabel">
							<h2>BusyWeek!</h2>
							<time>2015.02</time>
							<img src="images/work-busyweek.jpg">
							<ul>
								<li>
									BusyWeek! is a time-based Todo application, available on Web and Apple App Store, which also support the backup and restore to and from the cloud.<br>
									It's material-designed, truly responsive across platforms and based on modern web technologies including HTML5, CSS3, Sass and powerful <a href="http://vuejs.org">Vue.js</a>.
								</li>
								<li class="skill">
									<span class="cbp_tmicon-phone"></span>
									<span><b>JS</b></span>
									<span class="i-vue"></span>
									<span class="link"><a target="_blank" href="http://huangxuan.me/BusyWeek/dist/">Try it</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>Alitrip.com @Alibaba</h2>
							<time>2014 - 2015</time>
							<img src="images/intern-alitrip.jpg">
							<ul>
								<li>
									Alitrip, formerly Taobao Travel, is one of the biggest platform for China's online travel sector, on which there has over 10,000 merchants providing airplane tickets, vacation packages, hotel booking services, visa application services and tour guide services.<br>
									As a <b>Intern Front-End Engineer</b>, I provided mobile-web and hybrid-apps development for our online travel business. Besides, I  contribute to performance, UI rendering optimization and CSS library.
								</li>
								<li class="skill">
									<span class="cbp_tmicon-phone"></span>
									<span><b>JS</b></span>
									<a href="https://github.com/kissyteam/kissy"><span class="i-kissy"></span></a>
									<span class="link"><a target="_blank" href="http://alitrip.com">alitrip.com</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>SENOVA WebApp</h2>
							<img src="images/senova.jpg">
							<ul>
								<li>《多媒体交互设计一》结课作业，以北汽“绅宝”为目标品牌，iPad 为主要平台进行的 App 设计，旨在用一种可交互的方式介绍“绅宝”车型。完全采用 Html5 技术开发，可添加至主屏幕离线运行。着力于触控交互体验的优化与优雅的动画设计。</li>
								<li>Responsible : Front-End，Interaction，Product</li>
								<li>Partner : ZOE-张瑜</li>
								<li class="skill">
									<span class="cbp_tmicon-html"></span>
									<span class="fa fa-css3"></span>
									<span><b>JS</b></span>
									<span class="link"><a target="_blank" href="http://huangxuan.me/senova/">Link</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2 id="hslider">jQuery.HSlider</h2>
							<time>2013.10</time>
							<img src="images/work-hslider.jpg">
							<ul>
								<li>
									HSlider, a full-page scrolling, touch-friendly jQuery slider plugin for mobile and modern desktop browser only. All its animations are powered by CSS3 with GPU acceleration and URL sharing with hash is supported.
								</li>
								<li class="skill">
									<span class="fa fa-css3"></span>
									<span><b>JS</b></span>
									<span class="i-jquery"></span>
									<span class="link"><a target="_blank" href="https://github.com/Huxpro/jquery.HSlider">Github</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>《真相不止一个》</h2>
							<time>2013.10</time>
							<img src="images/work-truth.jpg">
							<ul>
								<li>Motion Graphic Design, powered by Adobe After Effect and cooperate with amazing artist <a href="https://www.behance.net/psychofish">@Psycho_fish</a></li>
								<li class="skill">
									<span><b>Ae</b></span>
									<span class="cbp_tmicon-video"></span>
									<span class="link"><a target="_blank" href="http://www.tudou.com/programs/view/Xa-pGW55N4g/">View</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>Intern @LxU Studio</h2>
							<time>2013.06 - 08</time>
							<img src="images/intern-lxu.jpg">
							<ul>
								<li>
									As a <b>Intern Motion Graphic Designer</b>, I participated in several creative advertising virus videos for our clients including Baidu and Continental.
								</li>
								<li class="skill">
									<span><b>Ae</b></span>
									<span class="cbp_tmicon-video"></span>
									<span class="link"><a target="_blank" href="http://weibo.com/lxustudio">@LxU</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>Puzzled Hybrid</h2>
							<time>2013.06</time>
							<img src="images/work-puzzle.png">
							<ul>
								<li> This font is parts of the course work of <b>Design Basis</b>, which mix Serif fonts, Sans-serif fonts and...zebra-stripe! Why I design it like that is still a puzzle to me, and the intro video is available below.
								<li class="skill">
									<span class="cbp_tmicon-font"></span>
									<span><b>Ps</b></span>
									<span><b>Ae</b></span>
									<span class="link"><a target="_blank" href="http://www.tudou.com/programs/view/DtG8SaFAoXU/">View</a></span>
								</li>
							</ul>
						</div>
					</li>
					<li>
						<div class="cbp_tmlabel">
							<h2>Home - UI Design</h2>
							<time>2012.11</time>
							<img src="images/work-uihome.jpg">
							<ul>
								<li>
									Participated in the students team with Huang Yi and Nie Ruijie as the UI Motion Designer. Won the first prize in 7th national IT application competition
								</li>
								<li class="skill">
									<span><b>Fl</b></span>
									<span class="link"><a target="_blank" href="http://animation.cuc.edu.cn/2c90943227f186ba0127f18a7ff10009/view/394">News</a></span>
								</li>
							</ul>
						</div>
					</li> -->
			</ul>
		</div>
	</div>
</body>

</html>